{include file="common/top" /}
<style>
html{
	background: #ffffff;
}

</style>
<form class="layui-form " lay-filter="test1"  action="" style="    background: #fff;">
	<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
		<legend>客户打款</legend>
	</fieldset>
	<div class="layui-form-item">
		<label class="layui-form-label ">客户名称：</label>
		<div class="layui-col-xs2">
			<input type="text" value="{$rs.name}" readonly="readonly" autocomplete="off" class="layui-input">
		</div>
		<label class="layui-form-label ">备款：</label>
		<div class="layui-col-xs1">
			<input type="text" value="{$rs.prepare_money}" readonly="readonly" autocomplete="off" class="layui-input">
		</div>
		<!-- <label class="layui-form-label ">是否垫款：</label>
		<div class="layui-col-xs1">
			<input type="checkbox" lay-skin="switch" lay-filter="status" lay-text="是|否" >
			<input type="hidden" name="is_advance" value="0" >
		</div> -->
		<input type="hidden" name="is_advance" value="0">
		<label class="layui-form-label ">打款金额：</label>
		<div class="layui-col-xs1">
			<input type="text"  name='amount' placeholder="请输入打款金额" autocomplete="off" class="layui-input">
		</div>
	</div>
	<div class="layui-form-item">
		<label class="layui-form-label">充值时间：</label>
		<div class="layui-col-xs2">
			<input type="text" name="create_time" id="date" lay-verify="datetime" placeholder="yyyy-MM-dd H:i:s" autocomplete="off" class="layui-input">
		</div>
		<label class="layui-form-label">媒介：</label>
		<div class="layui-col-xs2">
			<select name="media_id" lay-verify="required" lay-search=""  autocomplete="off">
				<option value="">直接选择或搜索选择</option>
				{volist name="user_list" id='user'}
					<option value="{$user.id}" {eq name=":session('uid')" value="$user.id"}{/eq}>{$user.username}</option>
				{/volist}
	        </select>
		</div>
	</div>
	<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
		<legend>账户充值</legend>
	</fieldset>
	
	<div class="layui-form-item">
		<div class="layui-col-xs12">
			<div id="test4" class="demo-transfer" style="float: left;"></div>
			<div class="layui-transfer-box" data-index="1" style="width: 84%;float: left; margin-left: 1%;height: auto; min-height: 360px;">
				
				<div id='cz' style="padding: 1%;"></div>
			</div>
		</div>
	</div>
	
	<hr />
	<div class="layui-form-item">
		<label class="layui-form-label">上传凭证：</label>
		<div class="layui-col-xs4">
			<div class="layui-upload-drag" id="test10">
			  	<i class="layui-icon"></i>
			  	<p>点击上传，或将文件拖拽到此处</p>
			  	<div class="layui-hide" id="uploadDemoView">
			  		<hr>
			    	<img src="" alt="上传成功后渲染" style="max-width: 196px">
			  	</div>
			</div>
		</div>
	</div>
	<div class="layui-form-item">
		<label class="layui-form-label">备注：</label>
		<div class="layui-col-xs8">
			<textarea name="note" autocomplete="off" placeholder="请输入详细备注" class="layui-textarea"></textarea>
		</div>
	</div>
	<hr/>
	<div class="layui-form-item">
		<div class="layui-input-block">
			<input type="hidden"  name="customer_id" value="{$rs.id}"  >
			<input type="hidden"  name="screenshot_url" value="">
			<button class="layui-btn"  lay-submit="" lay-filter="demo1">添加</button>
		</div>
	</div>
	
</form>
{include file="common/footer" /}
<script>
var t = new Date().getTime();
var $,form,layer,util,transfer,laydate,upload;
	layui.use(['form', 'layedit', 'laydate','transfer','util','upload'], function(){
		  form = layui.form ,layer = layui.layer,util = layui.util,$ = layui.$,transfer = layui.transfer,laydate = layui.laydate,upload = layui.upload;
		  laydate.render({
			    elem: '#date', //指定元素
			    type: 'datetime',
			    value: new Date(t)
			  });
		  //监听提交
		  form.on('submit(demo1)', function(data){
			var articleFrom = data.field;
			layer.load(1, { shade : [ 0.5, '#676a6c' ] }); 
			$.post("{:url('top_up')}?t=json",articleFrom,function(data){
				layer.closeAll();
				if (data['code'] == 1) { 
					var index1 = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
					parent.layer.close(index1); //再执行关闭 
					//父页面数据 ，重新加载
					parent.get_s(data['msg']);

				} else {
					
					layer.msg(data['msg'], { icon : 5 });
				}
			});
			
			return false;
		  });
		//监听开关状态操作
        form.on('switch(status)', function (obj) {
        	if(this.checked){
				  $("input[name=is_advance]").val(1);
			  }else{
				  $("input[name=is_advance]").val(0);
			  }
            form.render();
        });
      	//拖拽上传
		upload.render({
			elem: '#test10'
		  	,url: '{:url("Upload/index")}' //改成您自己的上传接口
		  	,exts: 'jpg|png|jpeg|gif'
	 		,choose: function(obj){
	 			layer.load(1, { shade : [ 0.5, '#676a6c' ] });
	 		}
		  	,done: function(res){
			  	layer.closeAll();
			  	if(res.code == 0){
			  		layer.msg('上传成功');
			    	layui.$('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', res.data);
			    	$("input[name=screenshot_url]").val(res.data);
			  	}else{
			  		layer.msg(res.msg);
			  	}
		  	}
		});
		
		get_acc({$rs.id});
      	//获取账户ID
      	function get_acc(id){
      		layer.load(1, { shade : [ 0.5, '#676a6c' ] }); 
			$.post("{:url('get_acc')}?t=json",{cu_id:id},function(data){
				layer.closeAll();
				if (data['code'] == 1) { 
					//console.log(data.data);
					 //可以重载所有基础参数
					 //显示搜索框
					transfer.render({
					  elem: '#test4'
					  ,data: data.data
					  ,title: ['账户ID']
					  ,showSearch: true
					  ,id: 'demo1' //定义索引
					})
					ff()
				} else {
					layer.msg(data['msg'], { icon : 5 });
				}
			});
      	}
      	$(document).on('click', '.layui-unselect', function() {
      		var c = $(this).hasClass('layui-form-checked');
			var ID = $(this).find('span').html();
			layer.load(1, { shade : [ 0.5, '#676a6c' ] }); 
			$.post("{:url('get_channel_info')}?t=json",{acc:ID},function(data){
				layer.closeAll();
				if (data['code'] == 1) { 
					   if(c){
							var str = '<div class="layui-form-item layui-col-space10 dd"><input type="hidden"  name="name_id[]" value="'+ID+'">';
							str += '<label class="layui-col-xs1" style="width: 12%;">端口：'+data.data.channel_name+'</label>';
							str += '<label class="layui-col-xs1" style="width: 12%;">账户ID：<span>'+ID+'</span></label>';
							str += '<div class="layui-col-xs1" style="width: 11%;"> <input type="text" name="currency[]"  placeholder="请输入充值账户币" autocomplete="off" class="layui-input"> </div>';
							str += '<div class="layui-col-xs1 lhlh" style="width: 11%;"> <input type="text"  name="rebate[]"  placeholder="请输入客户返点%" autocomplete="off" class="layui-input"> </div>';
							str += '<div class="layui-col-xs1" style="width: 11%;"> <input type="text" name="amounts[]"  placeholder="请输入人民币金额" autocomplete="off" class="layui-input"> </div>';
							str += '<div class="layui-col-xs1" style="width: 11%;"> <input type="text" name="sell_rebates[]"   placeholder="请输入销售返点%" autocomplete="off" class="layui-input"> </div>';
							str += '<div class="layui-col-xs1" style="width: 11%;"> <input type="text" name="channel_rebate[]"   placeholder="请输入端口返点%" autocomplete="off" class="layui-input"> </div>';
							str += '</div>';
							$('#cz').append(str);
						}else{
							$('#cz').find('.dd').each(function(k,v){
								var s = $(this).find('label:eq(1)').find('span').html();
								if(s == ID){
									$(this).remove()
								}
								
							});
						}
				} else {
					
					layer.msg(data['msg'], { icon : 5 });
				}
			});
		
      		
      	});
		//获取端口信息
		function get_channel(acc){
			
		}  
      	$(document).on('input', '.lhlh', function() {
      		//.parent()
      		var tt=/^[0-9]+.?[0-9]*$/;
      		var c = $(this).prev().find("input").val();
      		var next_obj = $(this).next().find("input")
      		if(!tt.test(c) || c <= 0){
      			$(next_obj).val('');
    			layer.msg('账户币必须大于0', { icon : 5 });
    			return false;
      		}
      		var rebate = $(this).find("input").val();
      		
      		var m;
      		var f;
      		//console.log(m);
      		if(rebate > 0){
      			f = (100+parseInt(rebate))/100;
      			m = c / f;
      		}else{
      			rebate = Math.abs(parseInt(rebate));
      			f = (100+rebate)/100;
      			m = c * f;
      		}
      		if(rebate){
      			$(next_obj).val(m.toFixed(2));
      		}else{
      			$(next_obj).val('');
      		}
      		
      	})
	});
	
	function ff(){
		$(".layui-transfer-box:eq(1)").css('display','none');
		$('.layui-transfer-active').css('display','none');
		$('.layui-transfer-header').find('i').css('display','none');
	};

</script>
